<h1>Nuevo Producto</h1>

<br/>

<div class="form-horizontal">
    <div class="form-group">
        <label for="inputProducto" class="col-sm-2 control-label">Nombre Producto</label>
        <div class="col-sm-10">
            <div id="inputProducto-message"></div>
            <input type="text" class="form-control" id="inputProducto" placeholder="Nombre Producto">
        </div>
    </div>

    <div class="form-group">
        <label for="inputCategoria" class="col-sm-2 control-label">Categoria</label>
        <div class="col-sm-10">
            <div id="inputCategoria-message"></div>
            <select class="form-control" id="inputCategoria" placeholder="Categoria">
                <option></option>
                <?php
                foreach ($decCategoriaTable as $value) {
                    $decCategoria = new DecCategoria();
                    $decCategoria = (object) $value;

                    echo "<option value='{$decCategoria->getCatId()}'>{$decCategoria->getCatCategoria()}</option>";
                }
                ?>
            </select>
        </div>
    </div>

    <div class="form-group">
        <label for="inputPrecio" class="col-sm-2 control-label">Precio</label>
        <div class="col-sm-10">
            <div id="inputPrecio-message"></div>
            <div class="input-group">
                <div class="input-group-addon">$</div>
                <input type="text" class="form-control" id="inputPrecio" placeholder="0.00">
            </div>
        </div>
    </div>

    <div class="form-group">
        <label for="inputDescripcion" class="col-sm-2 control-label">Descripcion</label>
        <div class="col-sm-10">
            <div id="inputDescripcion-message"></div>
            <input type="text" class="form-control" id="inputDescripcion" placeholder="Descripcion">
        </div>
    </div>

    <div class="form-group">
        <div class="col-sm-offset-2 col-sm-10">
            <button type="button" class="btn btn-primary" id="buttonSave">Crear</button>
            <button type="button" class="btn btn-danger" id="buttonCancel">Cancelar</button>
        </div>
    </div>
</div>

<script>
    $(document).ready(function () {
        /* LISTENERS */
        $("#buttonSave").click(function () {
            if (isValid()) {
                save();
            }
        });
        $("#buttonCancel").click(function () {
            $(location).attr("href", "<?php echo url_for("producto_lista/index"); ?>");
        });
    });

    function isValid() {
        var valid = true;

        var id = "inputProducto";
        if (isEmpty($("#" + id).val())) {
            valid = false;
            setError(id, "Campo requerido");
        } else {
            clearError(id);
        }

        var id = "inputCategoria";
        if (isEmpty($("#" + id).val())) {
            valid = false;
            setError(id, "Campo requerido");
        } else {
            clearError(id);
        }

        var id = "inputPrecio";
        if (!isNumber($("#" + id).val())) {
            valid = false;
            setError(id, "Debe ser un valor numerico");
        } else {
            if (0 >= $("#" + id).val()) {
                valid = false;
                setError(id, "Debe ser un valor numerico mayor que cero");
            } else {
                clearError(id);
            }
        }

        var id = "inputDescripcion";
        if (isEmpty($("#" + id).val())) {
            valid = false;
            setError(id, "Campo requerido");
        } else {
            clearError(id);
        }

        return valid;
    }

    function save() {
        var inputProducto = $("#inputProducto").val();
        var inputPrecio = $("#inputPrecio").val();
        var inputDescripcion = $("#inputDescripcion").val();
        var inputCategoria = $("#inputCategoria option:selected").val();

        $.ajax({
            type: "post",
            url: "<?php echo url_for("producto_nuevo/save"); ?>",
            data: {
                inputProducto: inputProducto,
                inputPrecio: inputPrecio,
                inputDescripcion: inputDescripcion,
                inputCategoria: inputCategoria
            },
            success: function (response) {
                $(location).attr("href", "<?php echo url_for("producto_lista/index"); ?>");
            }
        });
    }
</script>